<template>
    <lightning-card title="MiscModal" icon-name="custom:custom19">
        <div class="slds-var-m-around_medium">
            <lightning-input
                label="Header"
                type="text"
                value={header}
                class="header-jest"
                onchange={handleHeaderChange}
            ></lightning-input>
            <lightning-input
                label="Content"
                type="text"
                value={content}
                class="content-jest"
                onchange={handleContentChange}
            ></lightning-input>
            <br />
            <lightning-button
                onclick={handleShowModal}
                aria-haspopup="true"
                label="Show modal"
            >
            </lightning-button>
        </div>

        <c-view-source source="lwc/miscModal" slot="footer">
            Create a message modal overlayed on the current app window (see
            myModal component).
        </c-view-source>
    </lightning-card>
</template>
